<!-- 基于分类的店铺列表 -->
<template>
  <div class="store-list">
       <c-district :city="city_index" v-on:districting="chooseDistrict"></c-district>
      <a :href="`/store?store_id=${item.id}`" class="thai-cell" v-for="item in storeList" :key="item.id">
        <div class="store-image" v-if="item.store_image==null" style="background-image:url(http://c3-q.mafengwo.net/s9/M00/36/45/wKgBs1Z6WDyAfPmbAAEa6r-WYNg52.jpeg)"></div>
        <div class="store-image" v-else :style="`background-image:url(${item.store_image})`"></div>
        <div class="store-content">
          <div class="store-name">{{String(item.store_name).slice(0,20)}}</div>
           <div class="store-address" v-if="String(item.store_address)!=='null'">
            <img  class="address-img" src="../assets/icon/address.png">
         <span class="store-address">{{String(item.store_address).slice(0,60)}}</span></div>
        </div>
        </a>
  </div>
</template>

<script>
import * as util from '@/util/util'
import cDistrict from '@/components/district'

export default {
  data () {
    return {
      storeList: [],
      district_index: 0,
      city_index: 5
    }
  },

  methods: {
    chooseDistrict: function (data) {
      this.district_index = data
      console.log(this.district_index, data)
      // 筛选地区
      if (this.district_index) {
        this.storeList = this.cpStoreList.filter(function (item, index, array) {
          return item.district_index === data
        })
      } else {
        this.storeList = this.cpStoreList
      }
    },

    async getContent () {
      let type
      switch (this.$route.query.type) {
        case 'eat':
          type = 1
          break
        case 'shop':
          type = 4
          break
        case 'flight':
          type = 5
          break
        case 'discount':
          type = 7
          break
        case 'fun':
          type = 3
          break
      }

      const list = await util.requestApi('/thai/api/v1/get_store_list_by_type', 'get', `?store_type=${type}`)

      this.cpStoreList = this.storeList = list // 缓存一份列表数据
      // console.log(this.storeList, this.$route.query)
    }
  },
  created () {
    this.getContent()
  },
  components: {cDistrict}
}
</script>

<style src="../style/good.less"></style>
